<table class="table table-bordered">
	@foreach($list as $v)
		<tr>
			<td>{{ $v['name'] }}</td>
			<td>
				@foreach($v['item'] as $vo)
					<button type="button" data-spec-id="{{ $v['id'] }}" data-item-id="{{ $vo['id'] }}" id="item-{{ $vo['id'] }}" 
						class="btn spec-button {{ in_array($vo['id'],$items_ids) ? 'btn-success' : 'btn-default' }}">{{ $vo['item'] }}</button>
				@endforeach
			</td>
		</tr>
	@endforeach
</table>

<script type="text/javascript">
	

$(function(){
   $(".spec-button").click(function(){
	   if($(this).hasClass('btn-success')){
		   $(this).removeClass('btn-success');
		   $(this).addClass('btn-default');		   
	   }else{
		   $(this).removeClass('btn-default');
		   $(this).addClass('btn-success');		   
	   }
	   getSpecInput();
	});
})

function getSpecInput(){
	var spec_arr = {};
	$(".spec-button").each(function(){
	    if($(this).hasClass('btn-success')){
			var spec_id = $(this).data('spec-id');
			var item_id = $(this).data('item-id');
			if(!spec_arr.hasOwnProperty(spec_id))
				spec_arr[spec_id] = [];
		    spec_arr[spec_id].push(item_id);
			console.log(spec_arr);
		}
	});
	ajaxSpecInput(spec_arr);
}

function ajaxSpecInput(spec_arr){		
    var _goods_id = $("input[name='goods_id']").val();
	$.ajax({
			type:'get',
			data:{
				'spec_arr':spec_arr,
				'goods_id':_goods_id
				},
			url:"{{ route('admin.goods.getspecinput') }}",
			success:function(info){                            
				$("#abc").html(info);
				hbdyg();  // 合并单元格
			}
	});
}

// 合并单元格
function hbdyg() {
    var tab = document.getElementById("spec_input_tab"); //要合并的tableID
    var maxCol = 2, val, count, start;  //maxCol：合并单元格作用到多少列  
    if (tab != null) {
        for (var col = maxCol - 1; col >= 0; col--) {
            count = 1;
            val = "";
            for (var i = 0; i < tab.rows.length; i++) {
                if (val == tab.rows[i].cells[col].innerHTML) {
                    count++;
                } else {
                    if (count > 1) { //合并
                        start = i - count;
                        tab.rows[start].cells[col].rowSpan = count;
                        for (var j = start + 1; j < i; j++) {
                            tab.rows[j].cells[col].style.display = "none";
                        }
                        count = 1;
                    }
                    val = tab.rows[i].cells[col].innerHTML;
                }
            }
            if (count > 1) { //合并，最后几行相同的情况下
                start = i - count;
                tab.rows[start].cells[col].rowSpan = count;
                for (var j = start + 1; j < i; j++) {
                    tab.rows[j].cells[col].style.display = "none";
                }
            }
        }
    }
}
</script>